<script src="${ctxPath}/static/js/lay/modules/element.js"></script>
<blockquote class="layui-elem-quote" style="font-size: 14px">脱产培训积分规则
</blockquote>

<hr class="layui-bg-gray">
<form class="layui-form" action="" id="fulltime_form">
    <div class="layui-collapse" lay-filter="fulltime_collapse">
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">经营人员（员工管理中为服务类）</h2>
        <div class="layui-colla-content layui-show">

            <table class="layui-table">
                <colgroup>
                    <col width="200">
                    <col width="200">
                    <col width="200">
                    <col width="5%">
                </colgroup>
                <thead>
                <tr>
                    <th align="center">开始学时段(学时)</th>
                    <th>结束学时段(学时)</th>
                    <th>学分/时</th>
                    <th>
                        <button type="button" class="btn btn-primary " onclick="addJYRow()" >
                            <i class="fa fa-plus-circle"></i>
                        </button>
                    </th>
                </tr>
                </thead>
                <tbody id="jingying_table">
                @for(jy in jyTrains){
                    <tr>
                        <td><input type="text" name="jyEmpTrain[${jyLP.index}].startHour" value="${jy.startHour}"  autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="jyEmpTrain[${jyLP.index}].endHour" value="${jy.endHour}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="jyEmpTrain[${jyLP.index}].credit" value="${jy.credit}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td>
                            <button type="button" class="btn btn-primary " onclick="deleteRow($(this))">
                                <i class="fa fa-trash-o"></i>
                            </button>
                        </td>
                    </tr>
                @}
                </tbody>
            </table>
        </div>
    </div>
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">管理人员</h2>
        <div class="layui-colla-content">


            <table class="layui-table">
                <colgroup>

                    <col width="200">
                    <col width="200">
                    <col width="200">
                    <col width="1%">
                </colgroup>
                <thead>
                <tr>
                    <th align="center">开始学时段(学时)</th>
                    <th>结束学时段(学时)</th>
                    <th>学分/时</th>
                    <th>
                        <button type="button" class="btn btn-primary " onclick="addGLRow()" >
                            <i class="fa fa-plus-circle"></i>
                        </button>
                    </th>
                </tr>
                </thead>
                <tbody id="guanli_table">
                    @for(gl in glTrains){
                    <tr>
                        <td><input type="text" name="glEmpTrain[${glLP.index}].startHour" value="${gl.startHour}"  autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="glEmpTrain[${glLP.index}].endHour" value="${gl.endHour}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="glEmpTrain[${glLP.index}].credit" value="${gl.credit}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td>
                            <button type="button" class="btn btn-primary " onclick="deleteRow($(this))">
                                <i class="fa fa-trash-o"></i>
                            </button>
                        </td>
                    </tr>
                    @}
                </tbody>
            </table>
        </div>
    </div>
    <div class="layui-colla-item">
        <h2 class="layui-colla-title">技术人员</h2>
        <div class="layui-colla-content">

            <table class="layui-table">
                <colgroup>

                    <col width="200">
                    <col width="200">
                    <col width="200">
                    <col width="1%">
                </colgroup>
                <thead>
                <tr>
                    <th align="center">开始学时段(学时)</th>
                    <th>结束学时段(学时)</th>
                    <th>学分/时</th>
                    <th>
                        <button type="button" class="btn btn-primary " onclick="addJSRow()" >
                            <i class="fa fa-plus-circle"></i>
                        </button>
                    </th>
                </tr>
                </thead>
                <tbody id="jishu_table">
                    @for(js in jsTrains){
                    <tr>
                        <td><input type="text" name="jsEmpTrain[${jsLP.index}].startHour" value="${js.startHour}"  autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="jsEmpTrain[${jsLP.index}].endHour" value="${js.endHour}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td><input type="text" name="jsEmpTrain[${jsLP.index}].credit" value="${js.credit}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                        <td>
                            <button type="button" class="btn btn-primary " onclick="deleteRow($(this))">
                                <i class="fa fa-trash-o"></i>
                            </button>
                        </td>
                    </tr>
                    @}
                </tbody>
            </table>
        </div>
    </div>
    <div class="layui-colla-item">
            <h2 class="layui-colla-title">技能人员</h2>
            <div class="layui-colla-content">

                <table class="layui-table">
                    <colgroup>

                        <col width="200">
                        <col width="200">
                        <col width="200">
                        <col width="1%">
                    </colgroup>
                    <thead>
                    <tr>
                        <th align="center">开始学时段(学时)</th>
                        <th>结束学时段(学时)</th>
                        <th>学分/时</th>
                        <th>
                            <button type="button" class="btn btn-primary " onclick="addJNRow()" >
                                <i class="fa fa-plus-circle"></i>
                            </button>
                        </th>
                    </tr>
                    </thead>
                    <tbody id="jineng_table">
                        @for(jn in jnTrains){
                        <tr>
                            <td><input type="text" name="jnEmpTrain[${jnLP.index}].startHour" value="${jn.startHour}"  autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                            <td><input type="text" name="jnEmpTrain[${jnLP.index}].endHour" value="${jn.endHour}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                            <td><input type="text" name="jnEmpTrain[${jnLP.index}].credit" value="${jn.credit}" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
                            <td>
                                <button type="button" class="btn btn-primary " onclick="deleteRow($(this))">
                                    <i class="fa fa-trash-o"></i>
                                </button>
                            </td>
                        </tr>
                        @}
                    </tbody>
                </table>
            </div>
        </div>
</div>
    <div class="layui-form-item">
        <div class="layui-input-block" style="margin-top: 20px;">

            <button class="layui-btn" lay-submit lay-filter="fulltime_form" >提交保存</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<template>
    <tr>
        <td><input type="text" name="[].startHour" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
        <td><input type="text" name="[].endHour" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
        <td><input type="text" name="[].credit" autocomplete="off" class="layui-input" lay-verify="required|number"></td>
        <td>
            <button type="button" class="btn btn-primary " onclick="deleteRow($(this))">
                <i class="fa fa-trash-o"></i>
            </button>
        </td>
    </tr>
</template>
<script>
    $(function(){
        initFullTimeTrain();
    });

    function initFullTimeTrain() {
        layui.use(['layer', 'form'], function(){
            var element = layui.element;
            var layer = layui.layer;
            var form = layui.form;

            //监听折叠
            element.on('collapse(fulltime_collapse)', function(data){

            });

            form.on('submit(fulltime_form)', function(data){
                form.verify();
                $.ajax({
                    type: "POST",
                    url: 'integral/fulltime_train_add',
                    data: data.field,
                    dataType: "json",
                    success: function(data){
                        Feng.success("保存成功!");
                    }
                });
                return false;
            });
        });

    }


    function deleteRow($this) {
        $this.closest("tr").empty();
    }


    /**
     * 经营添加行
     */
    function addJYRow() {
        var trSize = $("#jingying_table>tr").length + 1;
        $("#jingying_table").append($("template").html().replace(/\[]/g,"jyEmpTrain["+trSize+"]"));
    }

    /**
     * 管理添加行
     */
    function addGLRow() {
        var trSize = $("#guanli_table>tr").length + 1;
        $("#guanli_table").append($("template").html().replace(/\[]/g,"glEmpTrain["+trSize+"]"));
    }

    /**
     * 技术人员
     */
    function addJSRow() {
        var trSize = $("#jishu_table>tr").length + 1;
        $("#jishu_table").append($("template").html().replace(/\[]/g,"jsEmpTrain["+trSize+"]"));
    }

    /**
     * 技能人员
     */
    function addJNRow() {
        var trSize = $("#jineng_table>tr").length + 1;
        $("#jineng_table").append($("template").html().replace(/\[]/g,"jnEmpTrain["+trSize+"]"));
    }


</script>
